<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>AOS - Animate on scroll library</title>
    <meta name="viewport" content="width=device-width">
    <link rel="stylesheet" href="css/styles.css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
    <style>
      [data-aos] {
        visibility: hidden;
      }
      [data-aos].animated {
        visibility: visible;
      }
    </style>
    <!--[if lt IE 9]>
    <script src="//cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <div class="aos-all">
      <div data-id="1" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="2" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="3" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="4" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="5" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="6" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="7" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="8" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="9" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="10" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="11" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="12" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="13" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="14" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="15" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="16" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="17" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="18" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="19" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="20" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="21" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="22" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="23" class="aos-item" data-aos="fadeInUp"></div>
      <div data-id="24" class="aos-item" data-aos="fadeInUp"></div>
    </div>

    <script src="dist/aos.js"></script>
    <script>
      if (!window.Cypress) AOS.init({
        useClassNames: true,
        initClassName: false,
        animatedClassName: 'animated',
      });
    </script>
  </body>
</html>
